<div ng-init="init();" class="kmi-layout-content B1501-content">
    <div class="kmi-header-row">
        <div class="kmi-side-btn left" ng-click="back();">
            <i class="material-icons">&#xE408;</i>
            <div class="kmi-can-click"></div>
        </div>
        <div class="brand-title">
            <div class="custom" ng-if="companyName">
                <div class="title" ng-bind="companyName"></div>
                <img src="" alt="" class="brand">
                <div class="gap"></div>
            </div>
            <div class="digiwin">
                <img src="image/smes_v340/logo_ch.png" alt="">
                <img src="image/smes_v340/logo_en.png" alt="">
            </div>
        </div>
        <div class="header-title" ng-bind="'B1501.title' | translate"></div>
        <button ng-click="favorite();">
            <img src='image/smes_v340/W_Com_Love_nor_32.png'></img>
            <div class='kmi-can-click'></div>
        </button>
        <div class="header-logo"></div>
    </div>
    <div class="kmi-layout-main-content">
        <div class="kmi-layout-page list">
            <div style="display: flex;flex-direction: row;position: relative;">
                <div style="flex:1;">
                    <div class="kmi-text-fields">
                        <label class="label" ng-bind="'B1501.dialog.station_no' | translate"></label>
                        <input ng-model="condition.op_display" readonly="readonly" ng-click="loadOpNo()"/>
                        <div class="tip"><i class="material-icons">&#xE5CF;</i></div>
                    </div>
                    <div class="kmi-text-fields">
                        <label class="label" style="width: 100px;" ng-bind="'B1501.machine_no' | translate"></label>
                        <input ng-model="condition.machine_no" />
                        <div class="tip search" ng-click="loadMachineNo();"><img src="image/icons/search.png"></img> </div>
                    </div>
                    <div class="kmi-text-fields">
                        <label class="label" style="width: 100px;" ng-bind="'B1501.serial_number' | translate"></label>
                        <input ng-model="condition.serial_number" />
                        <div class="tip search" ng-click="loadSerialNo();"><img src="image/icons/search.png"></img> </div>
                    </div>
                </div>
                <div style="flex:1;">
                    <div class="kmi-text-fields">
                        <label class="label" ng-bind="'B1501.plot_no' | translate"></label>
                        <input ng-model="condition.plot_no"/>
                        <div class="tip search" ng-click="loadPlotInfo();"><img src="image/icons/search.png"></img> </div>
                    </div>
                    <div class="kmi-text-fields">
                        <label class="label" style="width: 100px;" ng-bind="'B1501.station_no' | translate"></label>
                        <input ng-model="condition.station_no" />
                        <div class="tip search" ng-click="loadStationNo();"><img src="image/icons/search.png"></img> </div>
                    </div>
                    <div class="kmi-text-fields">
                        <label class="label" style="width: 100px;" ng-bind="'B1501.application_start' | translate"></label>
                        <input mdl-datepicker="condition.application_start"/>
                    </div>
                </div>
                <div style="flex:1;">
                    <div class="kmi-text-fields">
                    </div>
                    <div class="kmi-text-fields">
                        <label class="label" style="width: 100px;" ng-bind="'B1501.application_person' | translate"></label>
                        <input ng-model="condition.application_person" />
                        <div class="tip search" ng-click="loadApplicationNo();"><img src="image/icons/search.png"></img> </div>
                    </div>
                    <div class="kmi-text-fields">
                        <label class="label" style="text-align: center;" ng-bind="'B1501.application_end' | translate"></label>
                        <input mdl-datepicker="condition.application_end"/>
                    </div>
                </div>
                <div style="flex:0 0 116px;">
                    <div class="kmi-text-fields">
                        <div class="kmi-button kmi-button-confrim  btn-qrcode-query" ng-click="QRcodeScanner();">
                            <img src="image/icons/QRCode_w.png" style="width: 20px; padding-bottom: 3px;">
                            <label ng-bind="'B1501.qrcode_query' | translate"></label>
                            <div class="kmi-can-click"></div>
                        </div>
                    </div>
                    <div class="kmi-text-fields">
                    </div>
                    <div class="kmi-text-fields">
                        <div class="kmi-button kmi-button-confrim  btn-qrcode-query" ng-click="search();">
                            <label ng-bind="'B1501.search' | translate"></label>
                            <div class="kmi-can-click"></div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- 20220112 modify by Alan for M#104072 - 修復列寬調整記憶功能 -->
            <div class="kmi-list column-selector" column-selector-id="mainList" style="margin-bottom: 15px;">
                <div class="kmi-list__header">
                    <div class="kmi-list__column" style="flex:1; text-align: center;" ng-bind="'B1501.list.product_no' | translate"></div>
                    <div class="kmi-list__column" style="flex:1; text-align: center;" ng-bind="'B1501.list.product_name' | translate"></div>
                    <div class="kmi-list__column" style="flex:1; text-align: center;" ng-bind="'B1501.list.lot_no' | translate"></div>
                    <div class="kmi-list__column" style="flex:1; text-align: center;" ng-bind="'B1501.list.op_no' | translate"></div>
                    <div class="kmi-list__column" style="flex:1; text-align: center;" ng-bind="'B1501.list.qty' | translate"></div>
                    <div class="kmi-list__column" style="flex:1; text-align: center;" ng-bind="'B1501.list.station_no' | translate"></div>
                    <div class="kmi-list__column" style="flex:1; text-align: center;" ng-bind="'B1501.list.machine_no' | translate"></div>
                    <div class="kmi-list__column" style="flex:1; text-align: center;" ng-bind="'B1501.list.application_person' | translate"></div>
                    <div class="kmi-list__column" style="flex:1; text-align: center;" ng-bind="'B1501.list.application_time' | translate"></div>
                    <div class="kmi-list__column" style="flex:1; text-align: center;" ng-bind="'B1501.list.self_check_result' | translate"></div>
                    <div class="kmi-list__column" style="flex:1; text-align: center;" ng-bind="'B1501.list.project_result' | translate"></div>
                    <div class="kmi-list__column" style="flex:1; text-align: center;" ng-bind="'B1501.list.serial_number' | translate"></div>
                </div>
                <div class="kmi-list__row-content">
                    <div class="kmi-list__row" ng-repeat="item in datalist track by $index" ng-class="{'is-select':item.is_select}">
                        <div class="kmi-list__column  column-border" style="flex:1; text-align: center;" ng-bind="item.product_no"></div>
                        <div class="kmi-list__column  column-border" style="flex:1; text-align: center;" ng-bind="item.product_name"></div>
                        <div class="kmi-list__column  column-border" style="flex:1; text-align: center;" ng-bind="item.lot_no"></div>
                        <div class="kmi-list__column  column-border" style="flex:1; text-align: center;" ng-bind="item.op_no"></div>
                        <div class="kmi-list__column  column-border" style="flex:1; text-align: center;" ng-bind="item.check_qty"></div>
                        <div class="kmi-list__column  column-border" style="flex:1; text-align: center;" ng-bind="item.position_no"></div>
                        <div class="kmi-list__column  column-border" style="flex:1; text-align: center;" ng-bind="item.equipment_no"></div>
                        <div class="kmi-list__column  column-border" style="flex:1; text-align: center;" ng-bind="item.creator"></div>
                        <div class="kmi-list__column  column-border" style="flex:1; text-align: center;" ng-bind="item.check_time"></div>
                        <div class="kmi-list__column  column-border" style="flex:1; text-align: center;" ng-bind="item.qc_result_n"></div>
                        <div class="kmi-list__column  column-border" style="flex:1; text-align: center;" ng-bind="item.qc_item_result_n"></div>
                        <div class="kmi-list__column  column-border" style="flex:1; text-align: center;" ng-bind="item.pcs_no"></div>
                        <div class="kmi-can-click" ng-click="changeFix(item);"></div>
                    </div>
                </div>
            </div>
            <div class="select_panel" style="margin-bottom:10px;">
                <div class="qc_button tab" ng-click="switchItem('check_project')" ng-class="{'is-select':qc_item == 'check_project'}">
                    <label class="title-name" ng-bind="'B1501.check_project' | translate"></label>
                </div>
                <div class="qc_button tab" ng-click="switchItem('pic_upload')" ng-class="{'is-select':qc_item == 'pic_upload'}">
                    <label class="title-name" ng-bind="'B1501.pic_upload' | translate"></label>
                </div>
                <div class="qc_button tab" ng-click="switchItem('bad_reason')" ng-class="{'is-select':qc_item == 'bad_reason'}">
                    <label class="title-name" ng-bind="'B1501.bad_reason' | translate"></label>
                </div>
                <div class="qc_button tab" ng-click="switchItem('application_log')" ng-class="{'is-select':qc_item == 'application_log'}">
                    <label class="title-name" ng-bind="'B1501.applicant_check' | translate"></label>
                    
                </div>
            </div>
            <!-- 檢驗項目區 -->
            <!-- 20220112 modify by Alan for M#104072 - 修復列寬調整記憶功能 -->
            <div class="kmi-list checkList" column-selector-id="checkList" ng-show="qc_item == 'check_project'">
                <div class="kmi-list__header">
                    <div class="kmi-list__column" style="flex:0 0 100px;" ng-bind="'B0207.check_list.column1' | translate"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'B0207.check_list.column2' | translate"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'B0207.check_list.column3' | translate"></div>
                    <div class="kmi-list__column" style="flex:0 0 68px;" ng-bind="'B0207.check_list.column4' | translate"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'B0207.check_list.column5' | translate"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'B0207.check_list.column6' | translate"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'B0207.check_list.column7' | translate"></div>
                </div>
                <div class="kmi-list__row-content">
                    <div class="kmi-list__row" ng-repeat="item in inspectionInfo.qc_reason_detail track by $index">
                        <div class="kmi-list__column column-border" style="flex:0 0 100px;" ng-bind="item.reason_no"></div>
                        <div class="kmi-list__column column-border is-wrap" style="flex:1;" ng-bind="item.reason_name"></div>
                        <div class="kmi-list__column column-border is-wrap" style="flex:1;" ng-bind="item.reason_method"></div>
                        <div class="kmi-list__column column-border is-wrap" style="flex:0 0 68px;z-index:1;">
                            <img class="pic" ng-show="item.picture_path!=''" ng-src="{{server_url+item.picture_path}}"
                                 ng-click="open_checkPic(item);">
                            </img>
                        </div>
                        <div class="kmi-list__column column-border is-wrap" style="flex:1;" ng-bind="item.check_type===1?(item.reason_description+('（'+item.mini_value+'~'+item.max_value+'）')):item.reason_description"></div>
                        <div class="kmi-list__column column-input" style="flex: 1;">
                            <div ng-show="item.check_type == 0" class="check-point-switch" ng-class="{'is-selected':item.reason_value == 'true'}"
                                 ng-click="item.reason_value = item.reason_value=='true'?'false':'true'">
                                <div style="width:26px;height:24px;"></div>
                            </div>
                            <input ng-show="item.check_type == 1" mdl-calculater="item.reason_value" mdl-calculater-decimal="true" ng-click="RangeValue();"></input>
                            <img style="height:24px;width:28px;padding-left:4px;" ng-show="item.check_type == 1" ng-src="{{InRange(item)?'image/icons/check1.png':'image/icons/not1.png'}}"></img>
                            <input ng-show="item.check_type == 2" ng-model="item.reason_value"></input>
                        </div>
                        <!-- 20200110 modify by 韋齊 for M#65870 將原本div改成input可修正內容-->
                        <div class="kmi-list__column column-input" style="flex: 1;">
                            <input type="text" ng-model="item.description">
                        </div>
                    </div>
                </div>
            </div>
            <!-- 上傳照片 -->
            <div class="image-report" ng-show="qc_item == 'pic_upload'">
                <div class="pic-list" ng-if="picSrcArray.length != 0">
                    <div class="pic-item" ng-repeat="pic in picSrcArray track by $index">
                        <div class="pic-item-title">
                            <span style="color:white;margin:0px;position:absolute;top:10px;left:10px;">{{'#'+($index+1)}}</span>
                            <button class="mdl-button mdl-button--icon pic-delete" ng-click="pic_delete($index);">
                                <img src="image/icons/close.png"></img>
                            </button>
                        </div>
                        <img class="pic-img" ng-src="{{'data:image/jpeg;base64,'+pic}}" ng-click="pic_open($index)">
                    </div>
                </div>
                <img class="pic-background" src="image/icons/picture.png" ng-if="picSrcArray.length == 0">
                <button class="mdl-button mdl-js-button mdl-button--icon mdl-button--icon_prime" ng-click="pic_add();" style="position: absolute; left: 10px; bottom: 10px; z-index: 1;">
                    <img src="image/icons/add.png"></img>
                </button>
            </div>
            <!-- 不良原因欄位 -->
            <!-- 20220112 modify by Alan for M#104072 - 修復列寬調整記憶功能 -->
            <div class="kmi-list work-list detail-report" column-selector-id="workList" ng-show="qc_item == 'bad_reason'">
                <div class="kmi-list__header">
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'B1501.list.column1' | translate"></div>
                    <div class="kmi-list__column" style="flex:0 0 100px;" ng-bind="'B1501.list.column2' | translate"></div>
                    <div class="kmi-list__column" style="flex:0 0 48px;"></div>
                </div>
                <div class="kmi-list__row-content">
                    <div class="kmi-list__row" style="height: 34px"
                         ng-repeat="detail in inspectionInfo['checklist_detail'] track by $index">
                        <div class="kmi-list__column column-border column-input" style="flex:1;">
                            <input ng-click="loadInspectionReasonList(detail);" readonly="readonly" ng-value="detail.page_no +' ' + detail.page_name">
                        </div>
                        <div class="kmi-list__column column-border column-input" style="flex:0 0 100px;">
                            <input ng-click="input_defect_qty($event, detail);" readonly="readonly" ng-value="detail.item_qty">
                        </div>
                        <div class="kmi-list__column" style="flex:0 0 48px;">
                            <button class="mdl-button mdl-button--icon" ng-click="removeRow($index);">
                                <img style="margin: 0px" src="image/icons/delete.png"></img>
                            </button>
                        </div>
                    </div>
                </div>
                <button class="mdl-button mdl-js-button mdl-button--icon mdl-button--icon_prime" ng-click="addRow();" style="position: absolute; left: 10px; bottom: 10px; z-index: 1;">
                    <img src="image/icons/add.png"></img>
                </button>
            </div>
            <!-- 申请人检验记录 -->
            <!-- 20220112 modify by Alan for M#104072 - 修復列寬調整記憶功能 -->
            <div class="kmi-list checkList" column-selector-id="applicationList" ng-show="qc_item == 'application_log'">
                <div class="kmi-list__header">
                    <div class="kmi-list__column" style="flex:0 0 100px;" ng-bind="'B1501.check_log.column1' | translate"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'B1501.check_log.column2' | translate"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'B1501.check_log.column3' | translate"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'B1501.check_log.column4' | translate"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'B1501.check_log.column5' | translate"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'B1501.check_log.column6' | translate"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'B1501.check_log.column7' | translate"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'B1501.check_log.column8' | translate"></div>
                </div>
                <div class="kmi-list__row-content">
                    <div class="kmi-list__row" ng-repeat="item in applicationLog track by $index">
                        <div class="kmi-list__column column-border" style="flex:0 0 100px;" ng-bind="item.qcformno"></div>
                        <div class="kmi-list__column column-border is-wrap" style="flex:1;" ng-bind="item.itemtype"></div>
                        <div class="kmi-list__column column-border is-wrap" style="flex:1;" ng-bind="item.reasonno"></div>
                        <div class="kmi-list__column column-border is-wrap" style="flex:1;" ng-bind="item.reasonname"></div>
                        <div class="kmi-list__column column-border is-wrap" style="flex:1;" ng-bind="item.reasonmethod"></div>
                        <div class="kmi-list__column column-border is-wrap" style="flex:1;" ng-bind="item.reasondescription"></div>
                        <div class="kmi-list__column column-border is-wrap" style="flex:1;" ng-bind="item.inputvalue_n"></div>
                        <div class="kmi-list__column column-border is-wrap" style="flex:1;" ng-bind="item.description"></div>
                    </div>
                </div>
            </div>
            <div class="btn-panel-right" style="display: flex; justify-content: flex-end; margin-top:10px;">
                <div style="display: flex;align-items: center">
                    <label class="label" ng-bind="'B1501.re_apply_qc' | translate"></label>
                    <div style="margin-left: 10px;" class="check-point-switch" ng-class="{'is-selected':re_apply_qc}" ng-click="change_re_apply_qc();">
                        <div style="width:24px;height:24px;"></div>
                    </div>
                </div>
                <div class="kmi-button kmi-button-confrim" ng-click="confirm()" style="width:110px;display: inline-block;">
                    <label ng-bind="'B1501.confirm' | translate"></label>
                    <div class="kmi-can-click"></div>
                </div>
            </div>
        </div>
    </div>
</div>
